$(document).ready(function() {
		var box = $('#box');

	/*	box.bind('mouseover', function(){
			var tg = $(this);  // this를 통해서 event를 발생한 엘리먼트에 접근가능하다.
			tg.removeClass().addClass('mouseover');
			tg.find('> p').text('mouseover');
		});
		
		box.bind('mouseout', function(){
			var tg = $(this);
			tg.removeClass().addClass('mouseout');
			tg.find('> p').text('mouseout');
		});
		
		box.bind('mousedown', function(){
			var tg = $(this);
			tg.removeClass().addClass('mousedown');
			tg.find('> p').text('mousedown');
		});
		
		box.bind('mouseup', function(){
			var tg = $(this);
			tg.removeClass().addClass('mouseup');
			tg.find('> p').text('mouseup');
		});*/

		box.bind({
			mouseover : function() {
				var tg = $(this); // this를 통해서 event를 발생한 엘리먼트에 접근가능하다.
				tg.removeClass().addClass('mouseover');
				tg.find('> p').text('mouseover');
			},
			mouseout : function() {
				var tg = $(this);
				tg.removeClass().addClass('mouseout');
				tg.find('> p').text('mouseout');
			},
			mousedown : function() {
				var tg = $(this);
				tg.removeClass().addClass('mousedown');
				tg.find('> p').text('mousedown');
			},
			mouseup : function() {
				var tg = $(this);
				tg.removeClass().addClass('mouseup');
				tg.find('> p').text('mouseup');
			}
		});
	});